{% extends "homepage.html" %}

{% block content %}

<script type="text/javascript" src="{{url_for('emf.static', filename='elliptic_modular_form_util-functions.js') }}"></script>
<script type="text/javascript" src="{{ url_for('emf.static', filename='elliptic_modular_form_scripts.js') }}"></script>



{% if info.error is defined %}

<h1>There was an error in meeting your previous request. Please change parameters.</h1>

<div> 
<h2> Error message: </h2>
{{ info.error | safe }}
</div>
{% endif %}
<!-- To make an interface that is easier to read we implement each case of input separately -->

<!-- {{ info | safe }} $("div").data("option",{"start":1}); -->

<script>
$(document).ready(function() {
$("#l_list").data("start",1); $("#l_list").data("len",20); $("#l_list").data("min",1);
$("#l_list").data("name","level");
$("#w_list").data("start",1); $("#w_list").data("len",20); $("#w_list").data("min",1);
$("#w_list").data("name","weight");
$("#char_selection").data("char",0);
 print_list("#l_list");
 print_list("#w_list");
 });

function shift(id,lr) {
   var start = $(id).data("start");
   var min = $(id).data("min");
   var len = $(id).data("len");
   if (lr == "left")
      start = start - len;
   if (lr == "right")
      start = start + len;
   if (start <= min) {
      start = min;
   }
   $(id).contents().detach();
   $(id).data("start",start);
   $(id).data("min",min);
   $(id).data("len",len);
 /*alert("start:"+$(id).data("start")+" "+len+" "+min); */
   print_list(id);

}

function print_list(id) {
    var min = $(id).data("min");
    var start = $(id).data("start");
    var len = $(id).data("len");
    var name = $(id).data("name");
    var url = getAbsolutePath();
    if (start > min) {
       $(id).append("<a id='go_left' href='#' onclick=\"shift('"+id+"','left')\" style=\"\"><small>&lt;&lt;</small></a>");
    };
    var char = $("#char_selection").data("char");
    if (char == 0) {
       s = "&character=0"
    } else {
       s = "&character=all"
    }
    for (var i = start; i < len+start; i++) {
        /*s = "<a href="+url+"?"+name+"="+i+" style=\"display:inline\">" + i + "</a> ";*/
  /*s = "<a href='' onclick='set_value(\""+id+"\","+i+");document.browse.submit()' >" + i + "</a> ";*/
        s = "<a href=\"javascript:set_value('"+id+"',"+i+")\" style=\"display:inline\">" + i + "</a> ";
	$(id).append(s);
    }
    $(id).append("<a id='go_right' href='#' onclick=\"shift('"+id+"','right')\" style=\"display:inline\"><small>&gt;&gt;</small></a>");

};

function set_value(id,val) {
  var name = $(id).data("name"); 			   
  document.forms.browse[name].value=val;
  $(id).data("value",val);
  document.browse.submit();			   
}
</script>

<table>
  <tr>
    <td>
      <h1>Browse</h1>
      {% if info.browse_table.rows is defined %}
      {#{KNOWLl('mf.elliptic.browse.all.info') } #}
      In the table below you can brose spaces of Holomorphic Cusp Forms with
      given level and weight. The entry in the table is the dimension of the space.
      {% set table = info.browse_table %}
      {% set rows = info.browse_table.rows %}
      {% set row_class = cycler('odd', 'even') %}
      <p>
      <table class="ntdata">
        <thead>
          <tr>
            <th width="10px" style="">
              Level&nbsp;\&nbsp;Weight
            </th>
            {% for k in table.col_heads  %}
            <th>{{k}}</th>
            {% endfor %}
          </tr>
        </thead>
        <tbody>
          {% for row in rows  %}
          <tr class="{{row_class.next() }}">
            <th width="0%" style="background:#afa; border-right: 1px solid black">
              {% set N = table.row_heads[loop.index-1] %}
              {% set row_url = url_for('emf.render_elliptic_modular_form_space2',level=N) %}
              <a href="{{ row_url }}">{{ N }}</a>
            </th>
            {% for cell in row  %}
            <td align="center">
              <a style="" href="{{cell.url}}">{{cell.dim}}</a>
            </td>
            {% endfor %}
          </tr>
          {% endfor %}
        </tbody>
      </table>
      </p>
      {% endif %}
    </td>  
    <form name="browse" method = "get" action="{{url_for('.render_elliptic_modular_forms')}}">
    </form>
  </tr>
  <tr>
    <td>
      <h1>Find a specific cusp form</h1>
      <form name="search" method = "post" action="{{url_for('.render_elliptic_modular_forms')}}">	  
        <input type="text" name="jump_to" value="" placeholder="1.12"> 
	<input type="submit" value="Find">
      </form>
    </td>
  </tr>
  <tr>
    <td>
      <form name="search" method = "post" action="{{url_for('.render_elliptic_modular_forms')}}">
	<h1>Search</h1>
	<table class="">
	  <tr>
	    <td>Level:</td><td><input type="text" name="level" value="" example="4"></td>
	  </tr>
	  <tr>
	    <td>Weight:</td><td><input type="text" name="weight" value="" placeholder="12"></td>
	  </tr>
	  <tr>
	    <td>Character:</td><td><input type="text" name="character" value="" placeholder="0"></td> 
	  </tr>
	  <!--tr>
	    <td>Dimension of Galois Orbit:</td><td><input type="text" name="gdim" value="" placeholder="1"> 
<span class="formexample">(i.e. the rational field)</span></td>
	  </tr-->
	</table>
	<input type="submit" name="Submit" value="Search">
      </form>
    </td>
  </tr>
</table>

{% endblock content %}
